<template>
    <view class="register-wrap">
        <view class="login-info">
            <view class="info">
                <view class="img">
                    <image :src="baseUrl + '/app/login/shoujihao.png'" mode=""></image>
                </view>
                <u-input v-model="mobile" type="text" height="64" placeholder="请输入手机号" />
            </view>
            <view class="info">
                <view class="img">
                    <image :src="baseUrl + '/app/login/yzm.png'" mode=""></image>
                </view>
                <u-input v-model="code" type="text" height="64" placeholder="请输入验证码" />
                <view class="yzm" v-if="!show" @tap="getYzm">
                    获取验证码
                </view>
                <view style="padding-top: 12rpx;" v-if="show">
                    <u-count-down :timestamp="timestamp" :show-days="state" :show-hours="state" :show-minutes="state"
                        @end="ends"></u-count-down>
                </view>
            </view>
            <view class="info">
                <view class="img">
                    <image :src="baseUrl + '/app/login/pwd.png'" mode=""></image>
                </view>
                <u-input v-model="password" type="password" height="64" placeholder="请输入密码" />
            </view>
            <view class="info">
                <view class="img">
                    <image :src="baseUrl + '/app/login/pwd.png'" mode=""></image>
                </view>
                <u-input v-model="passwords" type="password" height="64" placeholder="请再次输入密码" />
            </view>
        </view>
        <view class="login-sub" @tap.stop="postUserRegister">
            确定
        </view>
        <view class="txts" @tap="goLogin">
            去登陆
        </view>
        <u-toast ref="uToast" />
    </view>
</template>

<script>
    export default {
        data() {
            return {
                mobile: '',
                code: '',
                password: '',
                passwords: '',
                timestamp: 59,
                state: false,
                show: false,
                txt: '获取验证码',
				baseUrl : this.$configs.urls
            }
        },
        onLoad() {
    
        },
        methods: {
            getYzm() {
                if (!this.mobile) {
                    this.$refs.uToast.show({
                        title: '手机号码不能为空',
                        duration:400,
                        type: 'default'
                    })
                    return false;
                }
                let data = {
                    mobile: this.mobile,
                    event:'forget_pwd'
                }
                this.$Request.post(this.$api.user.getYzm, data).then(res => {
					////console.log(res,"短信验证")
					this.show = true
                    this.$refs.uToast.show({
                        title: res.msg
                    })
                });
            },
            ends() {
                this.show = false
                this.txt = '再次获验证码'
    
            },
            goLogin() {
                uni.navigateTo({
                    url: "/userPage/user/login/passlogin"
                })
            },
            // 找回密码
            postUserRegister() {
                if (!this.mobile) {
                    this.$refs.uToast.show({
                        title: '手机号码不能为空'
                    })
                    return false;
                }
                if (!this.code) {
                    this.$refs.uToast.show({
                        title: '验证码不能为空'
                    })
                    return false;
                }
                if (!this.password) {
                    this.$refs.uToast.show({
                        title: '密码不能为空',
                        duration:400,
                        type: 'default'
                    })
                    return false;
                }
                if (!this.passwords) {
                    this.$refs.uToast.show({
                        title: '再次输入密码不能为空'
                    })
                    return false;
                }
                if (this.password == this.passwords) {
    
                } else {
                    this.$refs.uToast.show({
                        title: '两次输入密码不一样'
                    })
                    return false;
                }
                let data = {
                    mobile: this.mobile,
                    smscode: this.code,
                    password: this.password,
                }
                this.$Request.post(this.$api.user.retrievePwd, data).then(res => {
                    if(res.code==0){
                        this.$refs.uToast.show({
                            title: res.msg,
                            url: '/pages/login/login'
                        })
                    }else{
                        this.$refs.uToast.show({
                            title: res.msg
                            
                        })
                    }
                });
            }
        }
    }
</script>

<style lang="scss" scoped>
    .register-wrap {
        min-height: 100vh;
        padding-top: 62rpx;

        .login-info {
            width: 588rpx;
            margin: 0 auto;

            .info {
                width: 100%;
                height: 88rpx;
                border: 1rpx solid #BCBEBE;
                border-radius: 88rpx;
                padding: 12rpx 25rpx;
                display: flex;
                margin-top: 48rpx;

                .img {
                    width: 58rpx;
                    height: 58rpx;
                    margin-right: 10rpx;

                    image {
                        width: 100%;
                        height: 100%;
                    }
                }

                .yzm {
                    line-height: 64rpx;
                    color: #666666;
                    font-size: 30rpx;
                }
            }
        }

        .agreement {
            display: flex;
            margin: 0 auto;
            width: 500rpx;
            margin-top: 86rpx;

            .img {
                width: 45rpx;
                height: 45rpx;

                image {
                    width: 100%;
                    height: 100%;
                }
            }

            .txt {
                color: #333333;
                padding-left: 16rpx;
                font-size: 32rpx;
                line-height: 45rpx;
                flex: 1;
                text-align: center;
            }
        }

        .login-sub {
            background-image: linear-gradient(#FCB996, #F46971);
            color: #FFFFFF;
            text-align: center;
            font-size: 40tpx;
            line-height: 88rpx;
            width: 588rpx;
            border-radius: 88rpx;
            margin: 0 auto;
            margin-top: 75rpx;
        }

        .txts {
            width: 588rpx;
            margin: 0 auto;
            padding-top: 20rpx;
            color: #333333;
            font-size: 30rpx;
        }
    }
</style>

